<%@page import="com.bokecc.config.Config"%>
<%@page import="java.util.Iterator"%>
<%@page import="java.util.List"%>
<%@page import="com.bokecc.util.DemoUtil"%>
<%@page import="com.bokecc.util.APIServiceFunction"%>
<%@page import="org.dom4j.*"%>
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@page import="java.util.Map" %>
<%@page import="java.util.HashMap" %>
<%@page import="java.net.URLDecoder"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
 <%@ include file="/WEB-INF/jsp/include/taglib.jsp"%>
 <%@include file="/WEB-INF/jsp/include/head.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>upload vedio</title>
<script src="${ctxStatic }/progressBar/js/modernizr.js" type="text/javascript"></script>
<script src='${ctxStatic }/progressBar/js/stopExecutionOnTimeout.js?t=1'></script>
	<link rel="stylesheet" type="text/css" href="${ctxStatic }/progressBar/css/normalize.css">
	<link rel="stylesheet" type="text/css" href="${ctxStatic }/progressBar/css/default.css">
	<link rel="stylesheet" type="text/css" href="${ctxStatic }/progressBar/css/styles.css">
<style type="text/css">
.fla_btn {
	position: relative;
}

.fla_btn embed {
	position: absolute;
	z-index: 1;
}
.label{color:#000000}
#swfDiv{*position:absolute; z-index:2;}
</style>
<script type="text/javascript" src="${ctx }/js/swfobject.js"></script>
</head>
<body>
<h1 style="color:#000000;">上传视频</h1>
<hr />
<a href='index.jsp'>返回首页</a>
<hr />
<div id="tips"></div>
<form id="addvform" name="addvform" action="" method="get">
<input type="hidden" id="progress">
<div style="clear:both;"><label class="label">视频标题：</label><input id="title" name="title" type="text" /></div>
<div class="fla_btn"><span style="float:left;"><label class="label">选择视频：</label><input id="videofile" name="videofile" onchange="javascript:$('#btnSub').removeAttr('disabled')" type="text" /></span> <div
	id="swfDiv"></div> <input type="button" value="选择视频"
	id="btn_width" style="width: 80px; height: 25px" /></div>
<div style="margin-left: 300px;"><input style="padding:2px 20px;" type="button"  id="btnSub" value="上传" onclick="submitvideo();"></div>
<input id="videoid" name="videoid" type="hidden" value="" />
<div><label class="label">视频专辑：</label>
	<select id="dramaId" name="dramdId">
		<c:forEach items="${ dramaList}" var="drama">
			<option value="${drama.uuid }" selected="${drama.uuid==dramaId?'selected':'' }">${ drama.name}</option>
		</c:forEach>
	</select>
</div>
<label class="label">视频排序：</label><input type="number" min="1" name="sort" id="sort">
<div><input type="button" disabled="disabled" id="savevedio" value="保存" onclick="savevideo();"></div>
<br />
<hr />
<label class="label">videoid:</label><div id="videoidshow"></div>
<div style="width: 1000px;height: 20px;"><span style="float:left">上传进度：</span><div id="up" style="background-color:#4A8BF5;height: 20px;width: 0px;"></div></div>
<div><label class="label">请求地址：</label><span id="request_params"></span></div>
<div><label class="label">回调地址：</label><%= Config.notify_url%></div>
</form>

<script type="text/javascript">

// 加载上传flash ------------- start
	var swfobj=new SWFObject('http://union.bokecc.com/flash/api/uploader.swf', 'uploadswf', '80', '25', '8');
	swfobj.addVariable( "progress_interval" , 1);	//	上传进度通知间隔时长（单位：s）
	swfobj.addVariable( "notify_url" , "<%= Config.notify_url%>");	//	上传视频后回调接口
	swfobj.addParam('allowFullscreen','true');
	swfobj.addParam('allowScriptAccess','always');
	swfobj.addParam('wmode','transparent');
	swfobj.write('swfDiv');
// 加载上传flash ------------- end

//	-------------------
//	调用者：flash
//	功能：选中上传文件，获取文件名函数
//	时间：2010-12-22
//	说明：用户可以加入相应逻辑
//	-------------------
	function on_spark_selected_file(filename) {
		document.getElementById("videofile").value = filename;
	}
	
//	-------------------
//	调用者：flash
//	功能：验证上传是否正常进行函数
//	时间：2010-12-22
//	说明：用户可以加入相应逻辑
//	-------------------
	function on_spark_upload_validated(status, videoid) {
		if (status == "OK") {
			/* alert("上传正常,videoid:" + videoid); */
			document.getElementById("videoid").value = videoid;
			document.getElementById("videoidshow").innerHTML = videoid;
			$("#savevedio").removeAttr("disabled");
		} else if (status == "NETWORK_ERROR") {
			alert("网络错误");
		} else {
			alert("api错误码：" + status);
		}
	}
	
//	-------------------
//	调用者：flash
//	功能：通知上传进度函数
//	时间：2010-12-22
//	说明：用户可以加入相应逻辑
//	-------------------
	function on_spark_upload_progress(progress) {
		update(progress);
	/* $("#progress").val(progress);
		var uploadProgress = document.getElementById("up");
		if (progress == -1) {
			uploadProgress.innerHTML = "上传出错：" + progress;
		} else if (progress == 100) {
			uploadProgress.innerHTML = "进度：100% 上传完成";
		} else {
			uploadProgress.style.width = progress+"0px";
			uploadProgress.innerHTML = "进度：" + progress + "%";
		} */
	}
	
	function positionUploadSWF() {
		document.getElementById("swfDiv").style.width = document.getElementById("btn_width").style.width;
		document.getElementById("swfDiv").style.height = document.getElementById("btn_width").style.height;
	}
	
	/* function getReqUrl(url,title){
		$.ajax({
			type: "get",
		    url: "${ctx}/bokecc/getReqUrl",     //ajax请求地址
		    dataType: "json",
		    data:{title:title},
		    success: function (data) {
		    	alert(data.status);
    			if(data.status=="TRUE"){
    				url = data.data;
    			}
		    },
		    error :function(data){
		    	alert("error");
		    	alert(data);
		    }
		 });
	} */
	
	//控制上传
	function submitvideo() {
		var title = encodeURIComponent(document.getElementById("title").value, "utf-8");
		/* var tag = encodeURIComponent(document.getElementById("tag").value, "utf-8");
		var description = encodeURIComponent(document.getElementById("description").value, "utf-8");
		var superCategory = encodeURIComponent(document.getElementById("supercategory").value, "utf-8");
		var subCategory = document.getElementById("sub_" + superCategory);
		if (document.getElementById("supercategory") != null && subCategory == null){
			document.getElementById("tips").innerHTML = "<div style='color:red;'>一级分类不能添加视频，请重新选择</div>";
			return;
		} */
		
		/* var url = "${ctx}/CCboke/getuploadurl.jsp?title=" + title; */
		var url="${ctx}/bokecc/getReqUrl?title=" + title;
		
		/* if (subCategory != null) {
			url = url + "&categoryid=" + subCategory.value;
		} */
		
		var req = getAjax();
		req.open("GET", url, true);
		req.onreadystatechange = function() {
			if (req.readyState == 4) {
				if (req.status == 200) {
					var re = req.responseText;//获取返回的内容
					document.getElementById("uploadswf").start_upload(re); //	调用flash上传函数
					document.getElementById("request_params").innerHTML = re;
				}
			}
		};
		req.send(null);
		showmark();
		$progress.addClass('progress--active');
		update();
	}
	function getAjax() {
		var oHttpReq = null;

		if (window.XMLHttpRequest) {
			oHttpReq = new XMLHttpRequest;
			if (oHttpReq.overrideMimeType) {
				oHttpReq.overrideMimeType("text/xml");
			}
		} else if (window.ActiveXObject) {
			try {
				oHttpReq = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				oHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
			}
		} else if (window.createRequest) {
			oHttpReq = window.createRequest();
		} else {
			oHttpReq = new XMLHttpRequest();
		}

		return oHttpReq;
	}
	
	//控制视频分类显示
	/* showSub();
	function show() {
		subCategorys = document.getElementsByName("sub_category");
		for ( var i = 0; i < document.getElementsByName("sub_category").length; i++) {
			subCategorys[i].style.display = 'none';
		}
		showSub();
	}

	function showSub() {
		var superCategory = document.getElementById("supercategory").value;
		var subCategory = document.getElementById("sub_" + superCategory);
		if (subCategory != null) {
			subCategory.style.display = 'inline';
		}
	} */
	
	function savevideo(){
		var title = $("#title").val();
		var dramaId = $("#dramaId").val();
		var vid = $("#videoid").val();
		var fileName = $("#videofile").val();
		var sort = $("#sort").val();
		$.ajax({
			type: "get",
		    url: "${ctx}/dramaResource/add",     //ajax请求地址
		    dataType: "json",
		    data:{title:title,dramaId:dramaId,vid:vid,fileName:fileName,sort:sort},
		    success: function (data) {
    			if(data=="TRUE"){
    				alert("保存成功");
    			}
		    },
		    error :function(data){
		    	debugger;
		    }
		 });
	}
	
	function showmark(){
		top.$("#wrapper").addClass("wrapper").show();
		top.$(".htmleaf-container").show();
		top.$("#mark").addClass("mark");
	}
	
	var $progress = top.$('.progress'), $bar = top.$('.progress__bar'), $text = top.$('.progress__text'), percent = 0, update, resetColors, orange = 30, yellow = 55, green = 85, timer;
	resetColors = function () {
	    $bar.removeClass('progress__bar--green').removeClass('progress__bar--yellow').removeClass('progress__bar--orange').removeClass('progress__bar--blue');
	    $progress.removeClass('progress--complete');
	};
	update = function (percent) {
	    timer = setTimeout(function () {
	        percent = parseFloat(percent.toFixed(1));
	        $text.find('em').text(percent + '%');
	        if (percent >= 100) {
	            percent = 100;
	            $progress.addClass('progress--complete');
	            $bar.addClass('progress__bar--blue');
	            $text.find('em').text('Complete');
	            $(".close").show();
	        } else {
	            if (percent >= green) {
	                $bar.addClass('progress__bar--green');
	            } else if (percent >= yellow) {
	                $bar.addClass('progress__bar--yellow');
	            } else if (percent >= orange) {
	                $bar.addClass('progress__bar--orange');
	            }
	            update();
	        }
	        $bar.css({ width: percent + '%' });
	    }, 1);
	};
	/* setTimeout(function () {
		$progress.addClass('progress--active');
		update();
	}, 1000); */
	
	$(".close").on("click",function(){
		$('.wrapper,.htmleaf-container').hide();
	})

</script>
</body>
</html>